body {
  font-family: arial;
}

#main_container {
  padding: 20px 10px 0px 10px;
}

/* GRID */
.grid_combo {
  width: 20px;
}

#grid_content {
    overflow: auto;
}

#simpleTooltip {
    padding: 7px;
    border: 1px solid #A6A7AB;
    background: #F2F3F5;
    font-size: 12px;
}

/* HEADER */
#h1 {
  float: left;
  background: url('/images/header.gif');
  background-repeat: no-repeat;
  height: 111px;
  width: 567px;
  }

#h2 {
  background: url('/images/header_stretch.gif');
  float: right;
  background-repeat: repeat-x;
  height: 111px;
  }

#h3 {

  background: url('/images/header_stretch.gif');
  background-repeat: repeat-x;
  height: 111px;
  }

#h_ime {
   padding-top: 55px;
   padding-left: 12px;
   color: #FFF;
   font-size: 16px;
}

#footer {
  background-color: #fff;
  color: #006;
  font-size: 11px;
  text-align: right;
  padding: 2px 10px 0 0;
  clear: both;
  }

/* Secondary menu */

#sec {
   display:inline;
   float:right;
   margin:0;
   padding:0 5px 0 0;
}

#sec li {
  list-style-type: none;
  display: inline;
}
#sec li a {
  padding: 3px 10px 0 0;
  text-decoration: none;
  font-size: 14px;
  color: #c3c3c3;
}
#sec li a.logout {
  font-size: 16px;
  font-weight: 700;
}

#sec sup {
   color: #FFF;
   font-weight: bold;
   padding: 0 6px;
   background: url('/images/notify.png');
   background-repeat: no-repeat;
   padding-bottom: 3px;
   font-size: 11px;
}

/* DNEVNIK RADA */

#dnevnik_rada {
    margin-top: 10px;
    width: 1500px;
    border-collapse: collapse;
    border-color: #ababab;
}

.dnevnik_predmet {
    width: 120px;
    padding: 1px;
    margin: 2px 1px 1px 1px;
}

.dnevnik_cas {
    width: 180px;
}

#dnevnik_rada td {
    text-align: center;
}

#dnevnik_rada th {
    text-align: center;
    font-size: 12px;
    background-color: #dee3ec;
}

.small {
    width: 15px;
}

.cas_text {
    width: 95%;
    height: 110px;
    border: 0;
    overflow: auto;
}

p {
    margin: 0;
    padding: 0 0 0 1px;
}

.izostanak {
    padding: 2px 4px;
}

.novi_izostanak {
    text-decoration: none;
    font-size: 12px;
    padding: 2px 4px;
    cursor: pointer;
}

.upisan_izostanak {
    text-decoration: none;
    font-size: 12px;
    padding: 2px;
    color: red;
    cursor: pointer;
}

.neopravdan {
    background: #ddd none repeat scroll 0 0;
}

.ime_ucenika {
    font-size: 12px;
    text-align: left !important;
    padding-left: 2px;
}

.ime_ucenika select {
    font-size: 12px;
    text-align: left;
    /*width: 200px;*/
}

.period {
   margin: 0 auto;
   width: 250px;
}

.unesi_button {
    background: #eee;
    border: 1px solid #898989;
    color: #898989;
    font-weight: 700;
}

.opravdano, .neopravdano {
    font-size: 12px;
}

/* Razredi */

  .table_holder table {
      display: inline;
      float: left;
      border: 2px solid #555555;
      border-collapse: collapse;
  }

  .table_holder p {
      text-align: center;
      font-weight: 700;
  }

  .slovo_head {
      background-color:#D0D9FB;
      border: 1px solid #555555;

      width: 30px;
      height: 35px;
      text-align: center;
  }

  .slovo_content {
      background-color: #dde3f5;
      border: 1px solid #555555;

      width: 30px;
      height: 35px;
      text-align: center;
  }

  .slovo_content:hover {
      background-color: #FFD700;
  }

  .slovo_empty {
      background: #fff;
      border: 1px solid #555555;

      width: 30px;
      height: 35px;
      text-align: center;
  }

  .slovo_link {
      text-decoration: none;
      color: #555555;
      display: block;
      width: 100%;
  }

  .table_holder {
      float:left;
      background: #fff;
      padding:15px;
      margin-right: 15px;
      border: 1px solid #555555;
  }

  .ucenik_ih img.ima_clanarinu {
     border: 2px solid #00FF00;
  }

  /* Dnevnik */
img {
    border: 0;
}

h3 {
    font-size: 100%;
    margin: 0;
    padding: 0;
}

.ocena {
    color: black;
    text-decoration: none;
    padding-left: 2px;
    font-size: 14px;
}

.ocena_obrazlozena {
    color: blue;
}

.zakljucna_cell {
    background: #dee3ec;
}

#dnevnik_head th, #dnevnik_content th {
    font-weight: 600;
    background: #dee3ec;
    text-align: center;
}

#dnevnik_head td {
    font-weight: 700;
    font-size: 16px;
    text-align: center;
}

#dnevnik_content td {
    text-align: center;
}

#dnevnik_content th.predmet_naziv {
    text-align: left;
    padding: 0px 0px 0px 5px;
}

/* form_holder razreda */
.form_holder_razreda th {
    text-align: left;
}

.form_holder_razreda td input[type='text'] {
    width: 150px;
}

#simpleTooltip { padding: 7px; border: 1px solid #A6A7AB; background: #F2F3F5; }

.tooltip_image {
   background-image: url('/images/q3.gif');
   background-repeat:no-repeat;
   background-position:right;
   padding-right: 20px !important;
}

.bt_image {
   background-image: url('/images/q2.gif');
   background-repeat:no-repeat;
   background-position:right;
   padding-right: 20px !important;
}

.razred_head{
    font-weight: 800;
}

.razred_head a{
   border-top: 1px solid #000 !important;
}

.image_upload img{
     border: 1px solid #000;
     width: 85px;
     height: 113px;
 }

.ucenik_ih img {
    border: 1px solid #000;
    width: 85px;
    height: 113px;
}

.form_holder {
    color: #000;
    font-size:inherit;
    border-collapse:collapse;
    border-spacing:0;
    border-style:solid solid none;
    border-color: #DDD;
    font-size: 14px;
}

.form_holder tr {
  background-color:#FFFFFF;
  border-left:1px solid #DDDDDD;
  border-right:1px solid #DDDDDD;
}

.form_holder th, .form_holder td {
    border-color:#DDDDDD -moz-use-text-color;
    border-style:solid none;
    border-width:1px 0;
    text-align:left;
    vertical-align:top;
    padding:0.5em;
}

.form_holder th {
    background-color:#E7EEF6;
    white-space:nowrap;
    font-weight: bold;
}

.form_holder label {
    color:#666666;
    display:block;
    float:left;
    font-weight:normal !important;
    padding:3px 1em 0 0;
    text-align:left;
}

.form_list label {
    font-weight: 700 !important;
}


.form_holder a {
      text-decoration: none;
      color: #000;
  }

.form_holder input {
    width:auto;
}

.form_holder select, .form_holder input, .form_holder button, .form_holder textarea {
    -x-system-font:none;
    font-family:arial,helvetica,clean,sans-serif;
    font-size:99%;
    font-size-adjust:none;
    font-stretch:normal;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
    line-height:normal;
}

.error ul li {
    color: red;
    list-style-type: none;
}

.error ul li.saved {
    color: black;
}

/* Upload slika ucenika */

.image_upload {
   margin: 5px;
}

/* Grupni unos ocena */

.opis_ocena {
   width: 99%;
}

.opopis_ocena {
   width: 99%;
}

.neazuriran {
   background-color:#FF6442;
}

.azuriran {
   background-color:#B7F4AE;
}

#dnevnik_container {
   margin-top: 10px;
}

#dnevnik_container th {
   background: #DEE3EC;
   font-weight: 700;
   text-align: center;
}

.raspored_holder {
   background: #DEE3EC;
}

.label_ocena {
    font-size:10px;
}

#razred_in_menu {
    list-style-type: none;
    display: inline;
    margin: 0;
}

#razred_in_menu li {
    display: inline;
}

#razred_in_menu li a {
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
}

#week_navigation {
    list-style-type: none;
    display: inline;
    margin: 0;
}

#week_navigation li {
    display: inline;
}

#week_navigation li a {
    font-size: 16px;
    font-weight: 700;
    text-decoration: none;
}

a.button {
    background: transparent url('/images/bg_button_a.gif') no-repeat scroll top right;
    color: #444;
    display: block;
    float: left;
    font: normal 12px arial, sans-serif;
    height: 24px;
    margin-right: 6px;
    padding-right: 18px; /* sliding doors padding */
    text-decoration: none;
}

a.button span {
    background: transparent url('/images/bg_button_span.gif') no-repeat;
    display: block;
    line-height: 14px;
    padding: 5px 0 5px 18px;
}

a.bf_button {
  display:block;
  background: url(/images/button_right.gif) no-repeat 100%;
  float: left;
  outline: none;
  padding-right: 10px;
  text-decoration: none;
 }

.bf_button:hover {
  text-decoration: none;
}

.bf_button span{
  display:block;
  background: url(/images/button_left.gif) no-repeat;
  white-space: nowrap;
  line-height: 26px;
  padding: 0 0 0 10px;
  font-family: Arial, Verdana;
  font-size: 15px;
  font-weight: normal;
  color: rgb(255,255,255);
  text-transform: none;
 }

.sb {
  display:block;
  background: url(/images/sb_right.gif) no-repeat 100%;
  float: left;
  outline: none;
  padding-right: 5px;
  text-decoration: none;
 }

.sb:hover {
  text-decoration: none;
}

.sb span{
  display:block;
  background: url(/images/sb_left.gif) no-repeat;
  white-space: nowrap;
  line-height: 17px;
  padding: 0 0 0 5px;
  font-family: Arial, Verdana;
  font-size: 12px;
  font-weight: normal;
  color: rgb(0,0,0);
  text-transform: none;
 }

#menu_2 {

}

#menu_2 ul {
   list-style-type: none;
}

.ucenik_list {
    height: 500px;
}

.hide {
    display: none !important;
}

.show {
    display: block !important;
}

.obavestenja_razred a, .obavestenja_razred a:visited {
    text-decoration: none;
    color: blue;
}

/* ie hacks */

*:first-child+html table {
   empty-cells: show;
   border-collapse:collapse;
}

* html table {
   empty-cells: show;
   border-collapse:collapse;
}

.menu {
   height:26px;
   position:relative;
   z-index:100;
   margin-top: 8px;
}
/* hack to correct IE5.5 faulty box model */
* html .menu {width:746px; w\idth:745px;}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;width:130px;position:relative;}
/* style the links for the top level */
.menu a, .menu a:visited {
   display:block;
   font-size:12px;
   text-decoration:none;
   color:#fff;
   width:119px;
   height:26px;
   /*background:#09c;*/
   padding-left:10px;
   /*line-height:29px;*/
   font-weight:bold;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {width:130px; w\idth:119px;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:26px;left:0; width:130px;}
/* another hack for IE5.5 */
* html .menu ul ul {top:26px;t\op:26px;}

/* position the third level flyout menu */
.menu ul ul ul{left:130px; top:0px; width:130px;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-130px;}

.menu ul ul a, .menu ul ul a:visited {
   height: auto;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;;}

/* yet another hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {width:131px;w\idth:109px;}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible; }
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ visibility:visible;}

.menu_wide {
   height:26px;
   position:relative;
   z-index:100;
   margin-top: 8px;
}
/* hack to correct IE5.5 faulty box model */
* html .menu_wide {width:746px; w\idth:745px;}
/* remove all the bullets, borders and padding from the default list styling */
.menu_wide ul {padding:0;margin:0;list-style-type:none;}
.menu_wide ul ul {width:149px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu_wide li {float:left;width:149px;position:relative;}
/* style the links for the top level */
.menu_wide a, .menu_wide a:visited {
   display:block;
   font-size:12px;
   text-decoration:none;
   color:#fff;
   width:138px;
   height:26px;
   /*background:#09c;*/
   padding-left:10px;
   /*line-height:29px;*/
   font-weight:bold;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu_wide a, * html .menu_wide a:visited {width:149px; w\idth:138px;}

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu_wide ul ul {visibility:hidden;position:absolute;height:0;top:26px;left:0; width:149px;}
/* another hack for IE5.5 */
* html .menu_wide ul ul {top:26px;t\op:26px;}

/* position the third level flyout menu */
.menu_wide ul ul ul{left:149px; top:-1px; width:149px;}

/* position the third level flyout menu for a left flyout */
.menu_wide ul ul ul.left {left:-149px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu_wide table {position:absolute; top:0; left:0; border-collapse:collapse;;}

/* yet another hack for IE5.5 */
* html .menu_wide ul ul a, * html .menu_wide ul ul a:visited {width:150px;w\idth:128px;}

/* make the second level visible when hover on first level list OR link */
.menu_wide ul li:hover ul,
.menu_wide ul a:hover ul{visibility:visible; }
/* keep the third level hidden when you hover on first level list OR link */
.menu_wide ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu_wide ul :hover ul :hover ul{ visibility:visible;}